import 'dart:async';
import 'dart:math';

import 'package:flutter/cupertino.dart';
import 'package:shop/common/shop_material.dart';
import 'package:shop/commonWidget/MyRefresher.dart';

class Page1 extends StatefulWidget {
  Page1({Key key}) : super(key: key);

  @override
  _Page1State createState() => _Page1State();
}

class _Page1State extends State<Page1> {
  double opacity = 1.0;
  double oldopacity = 1.0;
  Timer timer;

  @override
  void initState() {
    print("init");
    super.initState();
    timer = Timer.periodic(Duration(milliseconds: 100), (time) {
      if (opacity != oldopacity) {
        setState(() {
          oldopacity = opacity;
        });
      }
    });
  }

  @override
  void dispose() {
    print("dispose");
    super.dispose();
    timer.cancel();
    timer = null;
  }

  final data = <Color>[
    Colors.purple[50],
    Colors.purple[100],
    Colors.purple[200],
    Colors.purple[300],
    Colors.purple[400],
    Colors.purple[500],
    Colors.purple[600],
    Colors.purple[700],
    Colors.purple[800],
    Colors.purple[900],
    Colors.purple[50],
    Colors.purple[100],
    Colors.purple[200],
    Colors.purple[300],
    Colors.purple[400],
    Colors.purple[500],
    Colors.purple[600],
    Colors.purple[700],
    Colors.purple[800],
    Colors.purple[900],
  ];

  @override
  Widget build(BuildContext context) {
    return MyRefresh(
      onLoading: () {},
      onRefresh: () {},
      child: CustomScrollView(
        slivers: <Widget>[
          _buildSliverAppBar(),
          _buildCommonWidget(),
          _buildSliverList(),
          _buildPersistentHeader("111111", Color(0xffcca4ff)),
          _buildSliverList(),
          _buildPersistentHeader("222222", Color(0xffcca4ff)),
          _buildSliverList(),
        ],
      ),
    );
  }

  Widget _buildCommonWidget() => SliverToBoxAdapter(
        child: Container(
          child: Text("data"),
        ),
      );
  Widget _buildPersistentHeader(String text, Color color) =>
      SliverPersistentHeader(
          pinned: true,
          delegate: _SliverDelegate(
            minHeight: 40.0,
            maxHeight: 100.0,
            child: Container(
                color: color,
                child: Center(
                  child: Text(
                    text,
                    style: TextStyle(fontSize: 18, shadows: [
                      Shadow(color: Colors.white, offset: Offset(1, 1))
                    ]),
                  ),
                )),
          ));
  Widget _buildSliverList() => SliverList(
        delegate: SliverChildBuilderDelegate(
            (_, int index) => Container(
                  alignment: Alignment.center,
                  width: 100,
                  height: 60,
                  color: data[index],
                  child: Text(
                    colorString(data[index]),
                    style: TextStyle(color: Colors.white, shadows: [
                      Shadow(
                          color: Colors.black,
                          offset: Offset(.5, .5),
                          blurRadius: 2)
                    ]),
                  ),
                ),
            childCount: data.length),
      );

  Widget _buildSliverAppBar() {
    return SliverAppBar(
      expandedHeight: 120.0,
      leading: _buildLeading(),
      title: Opacity(
        opacity: opacity,
        child: Text("shop"),
      ),
      actions: [
        IconButton(
            onPressed: () {},
            icon: Icon(
              Icons.star_border,
              color: Colors.white,
            ))
      ],
      elevation: 2,
      pinned: true,
      backgroundColor: Colors.orange,
      flexibleSpace: FlexibleSpaceBar(
        //伸展处布局
        // titlePadding: EdgeInsets.only(left: 55, bottom: 15), //标题边距
        collapseMode: CollapseMode.parallax, //视差效果
        title: InkWell(
          onTap: () {
            print("1111111111");
          },
          child: Container(
            height: 40,
            alignment: Alignment.centerLeft,
            margin: EdgeInsets.symmetric(horizontal: 10),
            decoration: BoxDecoration(
              borderRadius: BorderRadius.circular(20),
              color: Colors.white,
            ),
            child: Icon(Icons.search, color: Colors.grey),
          ),
        ),
        weizi: (double weizi) {
          opacity = (weizi - 1.2) * 10 / 3 > 1 ? 1 : (weizi - 1.2) * 10 / 3;

          print(opacity);
        },
        titlePadding: EdgeInsetsDirectional.only(
          start: 0,
          bottom: 6.0,
        ),
        centerTitle: false,
        // background: Image.network(
        //   "https://goss.veer.com/creative/vcg/veer/800water/veer-151051101.jpg",
        //   fit: BoxFit.cover,
        // ),
      ),
    );
  }

  Widget _buildLeading() => Opacity(
        opacity: opacity,
        child: Container(
            margin: EdgeInsets.all(10),
            child: Image.network(
                "https://goss.veer.com/creative/vcg/veer/800water/veer-151051101.jpg")),
      );

  String colorString(Color color) =>
      "#${color.value.toRadixString(16).padLeft(8, '0').toUpperCase()}";
}

class _SliverDelegate extends SliverPersistentHeaderDelegate {
  _SliverDelegate({
    @required this.minHeight,
    @required this.maxHeight,
    @required this.child,
  });

  final double minHeight; //最小高度
  final double maxHeight; //最大高度
  final Widget child; //孩子

  @override
  double get minExtent => minHeight;

  @override
  double get maxExtent => max(maxHeight, minHeight);

  @override
  Widget build(
      BuildContext context, double shrinkOffset, bool overlapsContent) {
    return new SizedBox.expand(child: child);
  }

  @override //是否需要重建
  bool shouldRebuild(_SliverDelegate oldDelegate) {
    return maxHeight != oldDelegate.maxHeight ||
        minHeight != oldDelegate.minHeight ||
        child != oldDelegate.child;
  }
}
